<template>
    <div>
        <el-card class="!border-none" shadow="never">
            <el-table size="large"  :data="list">
                <el-table-column label="序号(ID)" type="index" min-width="100" />
                <el-table-column label="代理人等级" min-width="160" prop="level"/>
                <el-table-column label="权益说明" min-width="200" prop="des"/>
                <el-table-column label="补贴方式" min-width="160" prop="num">
                    <template #default="{ row }">
                        <div class="mt-4">
                            <el-input v-model="row.num" :disabled="row.isDisable">
                                <template #append>{{ row.is_yuan?'元':'%' }}</template>
                            </el-input>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="操作" min-width="120" prop="num">
                    <template #default="{ row,$index }">
                        <el-button type="primary" v-perms="['user.agent/saveConfig']" link v-if="row.isDisable" @click="onEdit($index)">修改</el-button>
                        <el-button type="primary" v-perms="['user.agent/saveConfig']" link v-if="!row.isDisable" @click="onSave()">保存</el-button>
                        <el-button type="danger" v-perms="['user.agent/saveConfig']" link v-if="!row.isDisable" @click="onCancel">取消</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>
<script lang="ts" setup name="rights">
import {getConfig,saveConfig} from '@/api/agent'
import feedback from '@/utils/feedback'
const info:any = ref({})
const getInfo = async () => {
    const res = await getConfig({});
    console.log(res)
    info.value = res.info;
    list.value = [
        {
            level: '银牌代理/金牌代理',
            des: '邀请新用户注册并完成实名认证，得平台补贴（可叠加）',
            num: res.info.new_user_price,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀请用户成为代理人后会获得该用户代理人报名时一定比例的报名费分佣',
            num: res.info.invite_price,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀用户达成合作，代理人可获得平台收取该合作单一定比例的服务费分佣',
            num: res.info.user_order_point,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀渠道达成合作，代理人可获得平台收取该合作单一定比例的服务费分佣',
            num: res.info.channel_order_point,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀渠道/用户以补贴产品达成合作，其合作已完结后，代理人获得补贴产品补贴金额的一定比例分佣',
            num: res.info.order_subsidy_point,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀渠道/用户购买服务商的商品，且在平台分账完成后，代理人获得平台收取该服务商平台服务费的一定比例分佣',
            num: res.info.server_order_point,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀用户成为黄金会员，代理人可获得该用户所支付的一定比例会员报名费分佣',
            num: res.info.gold_zhijie_price,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀用户成为钻石会员，代理人可获得该用户所支付的一定比例会员报名费分佣',
            num: res.info.diamond_zhijie_price,
            isDisable: true
        },
        {
            level: '金牌代理',
            des: '间邀用户达成合作，代理人可获得平台收取该合作单一定比例的服务费分佣',
            num: res.info.gold_user_order_point,
            isDisable: true
        },
        {
            level: '金牌代理',
            des: '间邀用户成为代理人后会获得该用户代理人报名时一定比例的报名费分佣',
            num: res.info.indirect_price,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '金牌代理',
            des: '间邀渠道达成合作，代理人可获得平台收取该合作单一定比例的服务费分佣',
            num: res.info.gold_channel_order_point,
            isDisable: true
        },
        {
            level: '城市合伙人',
            des: '代理人报名成功后会城市合伙人会获得部分报名费分佣',
            num: res.info.city_price,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '银牌代理/金牌代理',
            des: '直邀的 用户/渠道 使用或者推广给别人使用企业报告工具，每生成1份报告获得一定收益',
            num: res.info.report_indirect_one,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '金牌代理',
            des: '间邀的 用户/渠道 使用或者推广给别人使用企业报告工具，每生成1份报告获得一定收益',
            num: res.info.report_indirect_two,
            is_yuan: true,
            isDisable: true
        },
        {
            level: '金牌代理',
            des: '间邀用户成为黄金会员，代理人可获得该用户所支付的一定比例会员报名费分佣',
            num: res.info.gold_jianjie_price,
            isDisable: true
        },
        {
            level: '金牌代理',
            des: '间邀用户成为钻石会员，代理人可获得该用户所支付的一定比例会员报名费分佣',
            num: res.info.diamond_jianjie_price,
            isDisable: true
        },
    ]
}
getInfo()
const list:any = ref([])
const index_num:any = ref(null)
const onEdit = (index:number) => {
    console.log(index)
    if (index_num.value != null) {
        return false;
    }
    index_num.value = index;
    list.value[index].isDisable = false;
}
const onSave = async () => {
    let params = {
        id: info.value.id,
        new_user_price: list.value[0].num,
        invite_price: list.value[1].num,
        user_order_point: list.value[2].num,
        channel_order_point: list.value[3].num,
        order_subsidy_point: list.value[4].num,
        server_order_point:  list.value[5].num,
        gold_zhijie_price:  list.value[6].num,
        diamond_zhijie_price:  list.value[6].num,
        gold_user_order_point: list.value[8].num,
        indirect_price: list.value[9].num,
        gold_channel_order_point:  list.value[10].num,
        city_price: list.value[11].num,
        report_indirect_one: list.value[12].num,
        report_indirect_two: list.value[13].num,
        gold_jianjie_price: list.value[14].num,
        diamond_jianjie_price: list.value[15].num,
    }
    console.log(params)
    await saveConfig(params)
    feedback.msgSuccess('保存成功')
    list.value[index_num.value].isDisable = true;
    index_num.value = null;
}
const onCancel = () => {
    list.value[index_num.value].isDisable = true;
    index_num.value = null;
}
</script>
<style scoped lang="scss">

</style>